import styled from 'styled-components'


export const ModalStyel = styled.div`

  .modal{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0,0,0, .3);
    z-index: 99;
    text-align: center;

    .container{
      width: 100%;
      height: calc( 100vh - 0px);
      justify-content: center;
      .dialog{
        width: 90%;
        height: calc( 80vh - 0px );
        border-radius: .15rem;
        padding: .16rem .32rem;
        background-color: white;
        overflow: scroll;
        text-align: left;
        font-size: .42rem;
        .close{
          position: absolute;
          right: .32rem;
          img{
            width: .53rem;
            height: .53rem;
          }
        }
      }
    }

  }

  .mask{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0,0,0, .3);
    z-index: 99;
    text-align: center;
  }


`